<%--
  Created by IntelliJ IDEA.
  User: hp
  Date: 2018/12/21
  Time: 9:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>角色设置</title>
    <jsp:include page="${pageContext.request.contextPath}/common/tag.jsp"/>
</head>
    <script>
        $(function () {
           $("#mytable").bootstrapTable({
               toolbar : '#addrole',
               url : '${pageContext.request.contextPath}/role/query',
               height : 260,
               pagination : true,
               pageSize : 2,
               columns : [
                   {field:'rid',title:'编号',align:'center'},
                   {field:'rname',title:'角色名称',align:'center'},
                   {title:'操作',align:'center',
                       formatter: function (index,row,value) {
                           return "<button class='btn btn-primary' onclick='tofenpei("+row.rid+")'>分配权限</button>"
                       }
                   },
               ]
           }) ;

           $("#addrole").click(function () {
              $("#addmodal").modal('show');
           });

            <!--校验框架-->
            /* $('#shopform').bootstrapValidator({
                 message: 'This value is not valid',
             }) ;*/
            <!--校验框架-->
            $('#addroleform').bootstrapValidator({
                message: 'This value is not valid',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    rName: {
                        message: '请输入角色名称',
                        validators: {
                            notEmpty: {
                                message: '角色名称不能为空！'
                            }
                        }
                    }
                }
            });


        });
    </script>
<body style="margin:20px 10px;overflow-y: hidden">
    <div class="">
        <%--<p class="col-sm-offset-5" style="font-size: 20px;">角色列表</p>--%>
        <button class="btn btn-primary" id="addrole"><span class="glyphicon glyphicon-plus"></span> 添加</button>
        <table id="mytable"></table>
    </div>
    <%--分配权限模态框--%>
    <div class="modal fade" id="fpmodal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title">提示信息</h4>
                </div>
                <div class="modal-body">
                    <div id="searchTree"></div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="dofenpei()">分配</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

    <div class="modal fade" id="addmodal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title">添加角色</h4>
                </div>
                <div class="modal-body">
                    <form action="" id="addroleform" method="post" class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="rolename" class="control-label">请输入角色名称:</label>
                            <input type="text" id="rolename" name="rName" class="form-control" placeholder="请输入角色名称">
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="baocun()">保存</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
</body>
<script>
    
    function baocun() {
        //启用较验
        $("#addroleform").data("bootstrapValidator").validate();
        //验证是否通过true/false
        var flag = $("#addroleform").data("bootstrapValidator").isValid() ;
        if (flag) {
            //序列化表单
            var formStr = $("#addroleform").serialize();
            //处理表单控件的中文乱码
            params = decodeURIComponent(formStr, true);
            $.ajax({
                type:'post',
                url: '${pageContext.request.contextPath}/role/insert',
                data : params,
                success:function (data) {
                    document.getElementById("addroleform").reset();
                    $("#addroleform").data('bootstrapValidator').resetForm();//清除当前验证的关键之处
                    /*隐藏对话框*/
                    $("#addmodal").modal('hide');
                    /*从新绑定表格*/
                    $("#mytable").bootstrapTable('load',data.rolelist);

                    //提示增加成功
                    swal("提示信息", "增加成功!", "success");
                }
            });
        }
    }
    
    
    var roleid = 0;
    function dofenpei() {
        //alert(roleid);
        var pmids = "";
        var cks = $("#searchTree").treeview("getChecked");
        $.each(cks,function (i,n) {
            console.log(roleid+"----"+n.id);
            pmids+=n.id+"-";
        });
        //alert(pmids);
        $.post('${pageContext.request.contextPath}/rolepermission/updaterpm',{'roleid':roleid,'pmids':pmids},function (data) {
            if(data.msg==1){
                /*关闭对话框*/
                $("#fpmodal").modal('hide');
                swal("提示信息", "分配成功!", "success");
            }
        })
    }

    function tofenpei(id){
        roleid = id;
        var a = 0;
        $("#fpmodal").modal('show');
        $("#fpmodal").on('shown.bs.modal',function () {
            if(++a == 1){
                $.post("${pageContext.request.contextPath}/role/dofenpei",{'roleid':id},function (data) {
                    $("#searchTree").treeview({
                        data :  data,
                        showCheckbox : true,
                        onNodeChecked : nodeChecked,
                        onNodeUnchecked : nodeUnchecked
                    });
                })
            }
        })
    }
    var nodeCheckedSilent = false;

    function nodeChecked(event, node) {
        if (nodeCheckedSilent) {
            return;
        }
        nodeCheckedSilent = true;
        checkAllParent(node);
        checkAllSon(node);
        nodeCheckedSilent = false;
    }

    var nodeUncheckedSilent = false;

    function nodeUnchecked(event, node) {
        if (nodeUncheckedSilent)
            return;
        nodeUncheckedSilent = true;
        uncheckAllParent(node);
        uncheckAllSon(node);
        nodeUncheckedSilent = false;
    }

    //选中全部父节点
    function checkAllParent(node) {
        $('#searchTree').treeview('checkNode', node.nodeId, {
            silent: true
        });
        var parentNode = $('#searchTree').treeview('getParent', node.nodeId);
        if (!("nodeId" in parentNode)) {
            return;
        } else {
            checkAllParent(parentNode);
        }
    }
    //取消全部父节点
    function uncheckAllParent(node) {
        $('#searchTree').treeview('uncheckNode', node.nodeId, {
            silent: true
        });
        var siblings = $('#searchTree').treeview('getSiblings', node.nodeId);
        var parentNode = $('#searchTree').treeview('getParent', node.nodeId);
        if (!("nodeId" in parentNode)) {
            return;
        }
        var isAllUnchecked = true; //是否全部没选中
        for (var i in siblings) {
            if (siblings[i].state.checked) {
                isAllUnchecked = false;
                break;
            }
        }
        if (isAllUnchecked) {
            uncheckAllParent(parentNode);
        }

    }

    //级联选中所有子节点
    function checkAllSon(node) {
        $('#searchTree').treeview('checkNode', node.nodeId, {
            silent: true
        });
        if (node.nodes != null && node.nodes.length > 0) {
            for (var i in node.nodes) {
                checkAllSon(node.nodes[i]);
            }
        }
    }
    //级联取消所有子节点
    function uncheckAllSon(node) {
        $('#searchTree').treeview('uncheckNode', node.nodeId, {
            silent: true
        });
        if (node.nodes != null && node.nodes.length > 0) {
            for (var i in node.nodes) {
                uncheckAllSon(node.nodes[i]);
            }
        }
    }
</script>
</html>
